<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>

<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <meta name="decorator" content="blank"/><c:set var="tabmode" value="${empty cookie.tabmode.value ? '0' : cookie.tabmode.value}"/>
    <c:if test="${tabmode eq '1'}"><link rel="Stylesheet" href="${ctxStatic}/jerichotab/css/jquery.jerichotab.css" />
    <script type="text/javascript" src="${ctxStatic}/jerichotab/js/jquery.jerichotab.js"></script></c:if>
  <title>${fns:getConfig('productName')}</title>
  <link rel="stylesheet" href="${ctxStatic}/layui/css/layui.css">
</head>
<body class="layui-layout-body">
<div class="layui-layout layui-layout-admin">
  <div class="layui-header">
    <div class="layui-logo">${fns:getConfig('productName')}</div>
    <%-- 
    <!-- 头部区域（可配合layui已有的水平导航） -->
    <ul class="layui-nav layui-layout-left">
      <li class="layui-nav-item"><a href="">控制台</a></li>
      <li class="layui-nav-item"><a href="">商品管理</a></li>
      <li class="layui-nav-item"><a href="">用户</a></li>
      <li class="layui-nav-item">
        <a href="javascript:;">其它系统</a>
        <dl class="layui-nav-child">
          <dd><a href="">邮件管理</a></dd>
          <dd><a href="">消息管理</a></dd>
          <dd><a href="">授权管理</a></dd>
        </dl>
      </li>
    </ul>
    --%>
     <!-- 头部区域（可配合layui已有的水平导航） -->
    <ul class="layui-nav layui-layout-left">
        <li class="layui-nav-item layadmin-flexible" id="LAY_app_flexible">
            <a href="javascript:;"  title="侧边伸缩">
              <i class="layui-icon layui-icon-shrink-right" ></i>
            </a>
        </li>
        <c:set var="menuList" value="${fns:getMenuList()}"/>
        <c:set var="firstMenu" value="true"/>
        <c:forEach items="${menuList}" var="menu" varStatus="idxStatus">
            <c:if test="${menu.parent.id eq '1'&&menu.isShow eq '1'}">
                 <li class="layui-nav-item">
                      <c:if test="${empty menu.href}">
                        <a onclick="javascript:menuHandle(${menu.id});"  data-id="${menu.id}">${menu.name}</a>
                      </c:if>
                      <c:if test="${not empty menu.href}">
                            <a href="${fn:indexOf(menu.href, '://') eq -1 ? ctx : ''}${menu.href}" target="mainFrame">${menu.name}</a>
                      </c:if>
                <c:if test="${firstMenu}">
                    <c:set var="firstMenuId" value="${menu.id}"/>
                </c:if>
                <c:set var="firstMenu" value="false"/>
            </c:if>
        </c:forEach>
    </ul>
    <ul class="layui-nav layui-layout-right">
      <li class="layui-nav-item">
        <a href="javascript:;">
          <img src="http://t.cn/RCzsdCq" class="layui-nav-img">
             ${fns:getUser().name}
        </a>
        <dl class="layui-nav-child">
          <dd><a href="${ctx}/sys/user/info">基本资料</a></dd>
           <dd><a href="${ctx}/sys/user/modifyPwd" target="mainFrame"><i class="icon-lock"></i>&nbsp;修改密码</a></dd>
        </dl>
      </li>
      <li class="layui-nav-item"><a href="${ctx}/logout">退出</a></li>
    </ul>
  </div>
  
  <div class="layui-side layui-bg-black">
    <div class="layui-side-scroll">
        <!-- 左侧导航区域（可配合layui已有的垂直导航） -->
        <ul class="layui-nav layui-nav-tree"  lay-filter="test" id="menu">
            <li class="layui-nav-item layui-nav-itemed">
                <a class="" href="javascript:;"><i class="layui-icon layui-icon-website"></i> <span >生源追踪</span></a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;"><i class="layui-icon layui-icon-component"></i> <span >生源列表</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-clipboard fa-lg"></i> <span >学校信息</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-file-text fa-lg"></i> <span >工做计划</span></a></dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;"><i class="layui-icon layui-icon-component"></i> <span >学员管理</span></a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;"><i class="layui-icon layui-icon-component"></i> <span >学员列表</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-user-o fa-lg"></i> <span >考勤管理</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-send-o fa-lg"></i> <span >沟通计划</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-frown-o fa-lg"></i> <span >成绩管理</span></a></dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;"><i class="fa fa-diamond fa-lg"></i> <span >管理设置</span></a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;"><i class="fa fa-address-book fa-lg"></i> <span >账号管理</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-check-square fa-lg"></i> <span >授权管理</span></a></dd>
                </dl>
            </li>
            <li class="layui-nav-item">
                <a href="javascript:;"><i class="fa fa-gear fa-lg"></i> <span >系统管理</span></a>
                <dl class="layui-nav-child">
                    <dd><a href="javascript:;"><i class="fa fa-window-restore fa-lg"></i> <span >系统信息</span></a></dd>
                    <dd><a href="javascript:;"><i class="fa fa-database fa-lg"></i> <span >操作日志</span></a></dd>
                </dl>
            </li>
        </ul>
        <%-- 
        <c:set var="firstMenu" value="true"/>
        <c:forEach items="${fns:getMenuList()}" var="menu" varStatus="idxStatus">
            <c:if test="${menu.parent.id eq '1'&&menu.isShow eq '1'}">
                 <li class="layui-nav-item">
                      <c:if test="${empty menu.href}">
                        <a href="${ctx}/sys/menu/tree?parentId=${menu.id}"  data-id="${menu.id}">${menu.name}</a>
                        
                        
	                  </c:if>
	                  <c:if test="${not empty menu.href}">
	                        <a href="${fn:indexOf(menu.href, '://') eq -1 ? ctx : ''}${menu.href}" target="mainFrame">${menu.name}</a>
	                  </c:if>
                <c:if test="${firstMenu}">
                    <c:set var="firstMenuId" value="${menu.id}"/>
                </c:if>
                <c:set var="firstMenu" value="false"/>
            </c:if>
        </c:forEach>
        
        <c:set var="menuList" value="${fns:getMenuList()}"/>
        <c:set var="firstMenu" value="true"/>
        <c:forEach items="${menuList}" var="menu" varStatus="idxStatus">
            <c:if test="${menu.parent.id eq (not empty param.parentId ? param.parentId:1)&&menu.isShow eq '1'}">
                <div class="accordion-group">
                    <div class="accordion-heading">
                        <a class="accordion-toggle" data-toggle="collapse" data-parent="#menu-${param.parentId}" data-href="#collapse-${menu.id}" href="#collapse-${menu.id}" title="${menu.remarks}"><i class="icon-chevron-${not empty firstMenu && firstMenu ? 'down' : 'right'}"></i>&nbsp;${menu.name}</a>
                    </div>
                    <div id="collapse-${menu.id}" class="accordion-body collapse ${not empty firstMenu && firstMenu ? 'in' : ''}">
                        <div class="accordion-inner">
                            <ul class="nav nav-list">
                                  <c:forEach items="${menuList}" var="menu2">
                                      <c:if test="${menu2.parent.id eq menu.id&&menu2.isShow eq '1'}">
                                          <li><a data-href=".menu3-${menu2.id}" href="${fn:indexOf(menu2.href, '://') eq -1 ? ctx : ''}${not empty menu2.href ? menu2.href : '/404'}" target="${not empty menu2.target ? menu2.target : 'mainFrame'}" ><i class="icon-${not empty menu2.icon ? menu2.icon : 'circle-arrow-right'}"></i>&nbsp;${menu2.name}</a>
                                          <ul class="nav nav-list hide" style="margin:0;padding-right:0;">
                                              <c:forEach items="${menuList}" var="menu3">
                                                  <c:if test="${menu3.parent.id eq menu2.id&&menu3.isShow eq '1'}">
                                                      <li class="menu3-${menu2.id} hide"><a href="${fn:indexOf(menu3.href, '://') eq -1 ? ctx : ''}${not empty menu3.href ? menu3.href : '/404'}" target="${not empty menu3.target ? menu3.target : 'mainFrame'}" ><i class="icon-${not empty menu3.icon ? menu3.icon : 'circle-arrow-right'}"></i>&nbsp;${menu3.name}</a></li>
                                                  </c:if>
                                               </c:forEach>
                                          </ul>
                                          </li>
                                     <c:set var="firstMenu" value="false"/>
                                     </c:if>
                                </c:forEach></ul>
                        </div>
                    </div>
                </div>
             </c:if>
        </c:forEach>
        --%>
      </ul>
    </div>
  </div>
  
  <div class="layui-body">
    <!-- 内容主体区域 -->
    <iframe id="mainFrame" name="mainFrame" src="" style="overflow:visible;" scrolling="yes" frameborder="no" width="100%" height="650"></iframe>
  </div>
  
  <div class="layui-footer">
    <!-- 底部固定区域 -->
    © layui.com - 底部固定区域
  </div>
</div>
<script src="${ctxStatic}/layui/layui.all.js" charset="utf-8"></script>
<script>
    //JavaScript代码区域
    /*
	layui.use('element', function(){
	  var element = layui.element;
	  
	});
    */
    var element;
    layui.use('element', function(){
        element = layui.element;
  });
    
      function  menuHandle(menuId){
          //清空menu内代码
          $("#menu").empty();
          var menuList = ${fns:toJson(menuList)};
          var menuHtml = "";
          if(menuList != null && menuList != "" && menuList != undefined){
              var menuIndex = 0;//用于计数是否是第一个菜单，第一个默认打开
              $.each(menuList, function(m2index, m2item) {
                 if(m2item.parentId == menuId && m2item.isShow =='1'){
                     //用于计数是否是第一个菜单，第一个默认打开
                     if(m2item.spread || m2item.spread == undefined){
                         menuHtml += '<li class="layui-nav-item layui-nav-itemed">';
                     }else{
                         menuHtml += '<li class="layui-nav-item">';
                     }
                     var m3Num = 0;
                     $.each(menuList, function(m3index, m3item) {
                         if(m3item.parentId == m2item.id){
                             if(m3Num == 0){
                                 menuHtml += '<a>';
                                 if(m2item.icon != undefined && m2item.icon != ''){
                                     if(m2item.icon.indexOf("icon-") != -1){
                                         menuHtml += '<i class="seraph '+m2item.icon+'" data-icon="'+m2item.icon+'"></i>';
                                     }else{
                                         menuHtml += '<i class="layui-icon" data-icon="'+m2item.icon+'">'+m2item.icon+'</i>';
                                     }
                                 }
                                 menuHtml += '<cite>'+m2item.name+'</cite>';
                                 menuHtml += '<span class="layui-nav-more"></span>';
                                 menuHtml += '</a>';
                                 menuHtml += '<dl class="layui-nav-child">';
                                 m3Num ++;
                             }
                             //if(data[i].children[j].target == "_blank"){
                             //    ulHtml += '<dd><a data-url="'+data[i].children[j].href+'" target="'+data[i].children[j].target+'">';
                            // }else{
                                 menuHtml += '<dd><a data-url="'+m3item.href+'">';
                            // }
                             if(m3item.icon != undefined && m3item.icon != ''){
                                 if(m3item.icon.indexOf("icon-") != -1){
                                     menuHtml += '<i class="seraph '+m3item.icon+'" data-icon="'+m3item.icon+'"></i>';
                                 }else{
                                     menuHtml += '<i class="layui-icon" data-icon="'+m3item.icon+'">'+m3item.icon+'</i>';
                                 }
                             }
                             menuHtml += '<cite>'+m3item.name+'</cite></a></dd>';
                         }
                     });
                     if(m3Num > 0){
                         menuHtml += "</dl>";
                     }else{
                         if(m2item.target == "_blank"){
                             menuHtml += '<a data-url="'+m2item.href+'" target="'+m2item.target+'">';
                         }else{
                             menuHtml += '<a data-url="'+m2item.href+'">';
                         }
                         if(m2item.icon != undefined && m2item.icon != ''){
                             if(m2item.icon.indexOf("icon-") != -1){
                                 menuHtml += '<i class="seraph '+m2item.icon+'" data-icon="'+m2item.icon+'"></i>';
                             }else{
                                 menuHtml += '<i class="layui-icon" data-icon="'+m2item.icon+'">'+m2item.icon+'</i>';
                             }
                         }
                         menuHtml += '<cite>'+m2item.name+'</cite></a>';
                     }
                 }
                 menuHtml += "</li>";
              });
             
              //$("#menu").append(menuHtml);
              $(".navBar ul").html(menuHtml).height($(window).height()-210);
             // $(".navBar ul").html(menuHtml);
              element.init();  //初始化页面元素
              $(window).resize(function(){
                  $(".navBar").height($(window).height()-210);
              })
          }
      }
    //菜单处理
    function  menuHandle(menuId){
    	//清空menu内代码
    	$("#menu").empty();
    	var menuList = ${fns:toJson(menuList)};
    	var menuHtml = "";
    	if(menuList != null && menuList != "" && menuList != undefined){
    		var menuIndex = 0;//用于计数是否是第一个菜单，第一个默认打开
    		$.each(menuList, function(index, item) {
               if(item.parentId == menuId && item.isShow =='1'){
            	   //用于计数是否是第一个菜单，第一个默认打开
            	   if(menuIndex == 0){
            		   menuHtml += '<li class="layui-nav-item layui-nav-itemed"><a href="javascript:;">'+ item.name + '</a>';
            		   menuIndex++;
            	   }else{
            		   menuHtml += '<li class="layui-nav-item"><a href="javascript:;">'+ item.name + '</a>';
            	   }
            	   var m3Num = 0;
            	   $.each(menuList, function(m3index, m3item) {
            		   if(m3item.parentId == item.id){
            			   if(m3Num == 0){
            				   menuHtml += '<dl class="layui-nav-child">';
            				   m3Num ++;
            			   }
            			   if(item.href == ""){
                               menuHtml += '<dd><a href=""  data-id="'+ m3item.id +'">'+ m3item.name +'</a></dd>';
                           }else{
                               menuHtml += '<dd><a href="${ctx}'+ m3item.href +'"  data-id="'+ m3item.id +'" target="mainFrame">'+ m3item.name +'</a></dd>';
                           }
            		   }
            	   });
            	   if(m3Num > 0){
            		   menuHtml += '</dl>';
            	   }
            	   menuHtml += "</li>";
               }
            });
    		$("#menu").append(menuHtml);
    	}
    }
    
    var isShow = true;  //定义一个标志位
    $('#LAY_app_flexible').click(function(){
        //选择出所有的span，并判断是不是hidden
        $('.layui-nav-item span').each(function(){
            if($(this).is(':hidden')){
                $(this).show();
            }else{
                $(this).hide();
            }
        });
        //判断isshow的状态
        if(isShow){
            $('.layui-side.layui-bg-black').width(60); //设置宽度
            $('.kit-side-fold i').css('margin-right', '70%');  //修改图标的位置
            //将footer和body的宽度修改
            $('.layui-body').css('left', 60+'px');
            $('.layui-footer').css('left', 60+'px');
            //将二级导航栏隐藏
            $('dd span').each(function(){
                $(this).hide();
            });
            //修改标志位
            isShow =false;
        }else{
            $('.layui-side.layui-bg-black').width(200);
            $('.kit-side-fold i').css('margin-right', '10%');
            $('.layui-body').css('left', 200+'px');
            $('.layui-footer').css('left', 200+'px');
            $('dd span').each(function(){
                $(this).show();
            });
            isShow =true;
        }
    });
</script>
</body>
</html>